/*

###############################

package-file

*/
// import { useState } from 'react'
import { Routes, Route, Navigate } from 'react-router-dom'
/*
react-router-dom::v5::api::::
AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, Routes, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes
*/
import './App.css'

import Com from './AppCom.js'
/*
Coms::
Home,Indexs,Fallback,Shoptype,Servertype,Searchrespage,Personal
*/

/*
在页面里面直接事件拿this拿不到的，得要实例里面定义的函数里面才能拿到，且拿到的是当前实例的this内容。
事件那里的箭头方法给个形参e，将e给到要用的方法那里，拿到的是普通的带react相关内容的event对象
*/

function App() {

  return (
    <>
      <Routes>
        {/* replace-router */}
        <Route path="/" element={<Navigate to="/index" replace={true} key="navi" />}></Route>
        {/* base-router */}
        <Route path="/" element={<Com.Home />}>
          <Route path="/index" element={<Com.Indexs />}></Route>
          <Route path="/fallback" element={<Com.Fallback />}></Route>
          <Route path="/shoptype/:shoptypeid" element={<Com.Shoptype />}></Route>
          <Route path="/servertype/:servertypeid" element={<Com.Servertype />}></Route>
          <Route path="/searchrespage" element={<Com.Searchrespage />}></Route>
          <Route path="/personal" element={<Com.Personal />}></Route>
        </Route>
      </Routes>
    </>
  )
}

export default App
